<div v-bind:class="[componentId]">
    <cly-blank>
        <template v-slot:icon>
            <img src="dashboards/images/no-widget.svg"></img>
        </template>
        <template v-slot:title>
            <h3 class="bu-mt-4">{{ i18n('common.emtpy-view-title') }}</h3>
        </template>
        <template v-slot:subTitle v-if="canUpdate">
            <p class="text-medium color-cool-gray-50 bu-m-0 bu-mt-4 bu-has-text-centered" v-html="i18n('common.no-widget-text')"></p>
            <div class="bu-has-text-centered bu-mt-5">
                <el-button type="text" size="small" @click="newWidget">
                    <span class="bu-has-text-weight-medium">{{ i18n('common.add-widget') }}</span>
                </el-button>
            </div>
        </template>
    </cly-blank>
</div>
